<template>
	<view id="PaymentMethod">
		<view class="PaymentMethod">
			<view class="wx PayType" @click="radioAll('3')">
				<!-- <image src="/pageA/static/pay_wechat@3x.png"></image> -->
				<image src="../static/pay_wechat@3x.png"></image>
				<view class="content">
					微信支付
				</view>
				<view class="radio" :class="radioA=='3'?1:'radioActive'" ></view>
			</view>
			<view class="ye PayType" @click="radioAll('1')">
				<image src="../static/pay_balance1@3x.png"></image>
				<view class="content">
					余额支付
				</view>
				<view class="radio" :class="radioA=='1'?1:'radioActive'" ></view>
			</view>
			<view class="dj PayType" @click="radioAll('4')">
				<image src="../static/pay_balance2@3x.png"></image>
				<view class="content">
					冻结余额支付
				</view>
				<view class="radio" :class="radioA=='4'?1:'radioActive'" ></view>
			</view>
			
		</view>
		<view class="bottomcar savebottom">
						<view class="bottomcontent">
							合计：<text class="price">￥{{total}}</text>
						</view>
							<navigator url @click="jiesuan()" class="button">
								结算
							</navigator>
				</view>
	</view>
</template>

<script>
	import md5 from '@/common/api/md5.js'
	import {requestUrl} from '@/common/config.js'
	export default {
		data() {
			return {
				radioA:'3',
				total:'',
				order:'',
				access_token:'',
				order_sn:''
			};
		},
		onShow() {
			if(uni.getStorageSync('TotalPrice')){
			this.total=JSON.parse(uni.getStorageSync('TotalPrice'))
			}
			if(uni.getStorageSync('order')){
			this.order=JSON.parse(uni.getStorageSync('order'))
				
			}
			
		},
		onLoad(option) {
			const eventChannel = this.getOpenerEventChannel()
			  // 监听acceptDataFromOpenerPage事件，获取上一页面通过eventChannel传送到当前页面的数据
			  eventChannel.on('acceptDataFromOpenerPage', data=> {
				this.order=data
				this.total=data.order_amount
			  })
		},
		methods:{
			jiesuan(){
				let time = Math.round(new Date().getTime() / 1000).toString()
				this.access_token=JSON.parse(uni.getStorageSync('access_token'))
				let _this = this
				let Time = ['time', time].join('=')
				let TYPE = ['type', this.radioA].join('=')
				let Order = ['orders', this.order.order_sn].join('=')
				let Access_token = ['access_token', this.access_token].join('=')
				let content = ['content=pinet.FeiMao.2017'].join()
				let arr = [content,Order,TYPE,Time].sort(function(a, b) {
					a - b
				})
				let newarr = md5(arr.join('&'))
					if(this.radioA==3){
						
						uni.request({
							url: requestUrl+'/app/order/payorder',
							method: "GET",
							data: {
								access_token: JSON.parse(uni.getStorageSync('access_token')),
								time: time,
								sign: newarr,
								type:this.radioA,
								orders:this.order.order_sn,
								JSAPI: 1
							},
							success: function(res) {
								if(res.data.errcode==0){
								uni.requestPayment({
								    provider: 'wxpay',
								    timeStamp: res.data.content.timeStamp,
								    nonceStr: res.data.content.nonceStr,
								    package: res.data.content.package,
								    signType: 'MD5',
								    paySign: res.data.content.paySign,
									// totalFee: res.data.content.count,
								    success: function (res) {
								        console.log('success:' + JSON.stringify(res));
										uni.redirectTo({
											url: '/pagesB/orderdetails/orderdetails'
										});
								    },
								    fail: function (err) {
								        console.log('fail:' + JSON.stringify(err));
										uni.redirectTo({
											url: '/pagesB/orderdetails/orderdetails'
										});
										uni.showToast({
											title:err,
											icon:'none'
										})
								    }
								});
								}
								
							}
						});
						
					}else{
						uni.showModal({
							title:'提示',
							content:`本次交易将从你的余额中扣除${this.total}元，确认支付吗`,
							success: (res) => {
								if(res.confirm){
									uni.request({
										url: requestUrl+'/app/order/payorder',
										method: "GET",
										data: {
											access_token: JSON.parse(uni.getStorageSync('access_token')),
											time: time,
											sign: newarr,
											type:this.radioA,
											orders:this.order.order_sn
										},
										success: function(res) {
											console.log(res)
											uni.showToast({
												title:res.data.message,
												icon:'none'
											})
											if(res.data.errcode==0){
												console.log(res)
												uni.setStorage({
												    key: 'order_sn',
												    data: JSON.stringify(res.data.content.order_sn),
												    success: function () {
												    }
												});
												uni.redirectTo({
												    url: '/pagesB/orderdetails/orderdetails'
												});
											}
											
										}
									});
								}
							}
						})
						
					}

			},
			radioAll(e){
				this.radioA=e
			}
		}
	}
</script>

<style lang="less" scoped>
	#PaymentMethod{
		display: flex;
		flex-direction: column;
		height: 100%;
	}
	.PaymentMethod{
		flex: 1;
		padding-top: 20rpx;
		background-color: #F3F4F5;
		.PayType{
			display: flex;
			align-items: center;
			padding: 30rpx 40rpx;
			position: relative;
			background-color: #fff;
			border-top: 1px solid #EDEDED;
			image{
				width: 40rpx;
				height: 40rpx;
			}
			.content{
				flex: 1;
				margin-left: 24rpx;
			}
			.radio{
				width: 32rpx;
				height: 32rpx;
				position: absolute;
				bottom: 35rpx;
				right: 45rpx;
				background: url(@/static/selected%20active.png) 0px 0px;
				background-size: 32rpx 32rpx;
			}
			.radioActive{
				background: url(@/static/selected／on.png) 0px 0px;
				background-size: 32rpx 32rpx;
			}
		}
	}
		.bottomcar{
		width: 95%;
		height: 100rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 0 20rpx;
		background-color: #fff;
		.bottomcontent{
			font-size: 24rpx;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #111111;
			display: flex;
			align-items: center;
			.price{
				font-size: 32rpx;
				font-family: PingFangSC-Medium, PingFang SC;
				font-weight: 500;
				color: #DB1B22;
				margin: 0 10rpx;
			}
			.freight{
				font-size: 20rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #111111;
			}

		}
		.button{
			padding: 12rpx 60rpx;
			background: #DB1B22;
			border-radius: 36px;
			font-size: 32rpx;
			font-family: PingFangSC-Regular, PingFang SC;
			font-weight: 400;
			color: #FFFFFF;
			margin-left: 30rpx;
		}
	}
	.savebottom {
		padding-bottom: 0;
		padding-bottom: constant(safe-area-inset-bottom);
		padding-bottom: env(safe-area-inset-bottom);
	}
</style>
